@function computed-vw($px) {
    @return $px/1080*100vw;
}

page-graphic-login {
    .scroll-content {
        overflow-y: hidden;
        padding: 0 !important;
    }

    .fixed-content{
        background: url(./../assets/images/login/bg_login.png) no-repeat;
        background-size: cover;
    }
    .logo{
        text-align: center;
        height: computed-vw(220);
        margin-top: computed-vw(229);
        margin-bottom: computed-vw(136);
        img{
            width: 37.33vw;
        }
    }

    .login{
        width: 100%;
        text-align: center;
        padding: 0 13.735vw;
        .fake{
            position: absolute;
            opacity: 0;
            z-index: 10;
        }
        .rel{
            margin-left: 16px;
            &:after{
                content: " ";
            }
        }
    }
    .button-box{
        text-align: center;
        bottom: 9.16667vw;
        position: absolute;
        left: 50%;
        margin-left: -37.8700vw;
        .login-button{
            background: rgba(39, 161, 106, 0.2);
            width: computed-vw(818);
            height: computed-vw(112);
            font-size:computed-vw(42);
            border-radius: 5.06vw;
            border: computed-vw(2) solid #ffffff;
            color: #FFFFFF;
        }
        .login-button:active{
            background: #3ec56a;
        }
        .login-button:disabled{
            background: rgba(67, 210, 114, 0.5);
            color: rgba(255, 255, 255, 0.8);
        }
    }
    .button-md:hover:not(.disable-hover) {
        background-color: #07a963;
    }

    .container {
       /* margin-top: computed-vw(281);*/
        width: 100%;
        height: 50%;
        display: flex;
        flex-direction: column;
        position: absolute;
        user-select: none;
    }

    .warp-tip-msg {
        display: block;
        text-align: center;
        vertical-align: middle;
        color:#ffffff !important;
        font-size: computed-vw(45);
        line-height: computed-vw(30);
        height: computed-vw(30);
    }

    .warp-small-tip-msg{
        display: none;
        margin: 0;
        text-align: center;
        vertical-align: middle;
        color:#7d0000 !important;
        font-size: computed-vw(50);
        line-height: computed-vw(30);
        height: computed-vw(30);
    }
}
